@import "../../_common_sass/base";

.chart {
    .fs-36{
        font-size: px2rem(36px);
    }
    .org-head{
        height:px2rem(200px);
        margin-bottom: px2rem(30px);
        background-image:url(../images/bg.png);
        background-size: 100% 100%;
        color: #fff;
        text-align: center;

        .row{
            @extend .clearfix;
            padding-top: px2rem(50px);
            li{
                position: relative;
                float: left;
                width: 33.3%;
                font-size: px2rem(20px);
                p{
                    font-family:PingFangSC-Medium;
                    &:first-child{
                        font-size: px2rem(64px);
                        font-weight: 700;
                        line-height: 1;
                    }
                    img{
                        margin: px2rem(3px) px2rem(10px) 0 0;
                        width: px2rem(24px);
                        //height: px2rem();
                    }
                }
                &:after{
                    content: ' ';
                    position: absolute;
                    right: 0;
                    top: 50%;
                    transform: translateY(-50%);
                    width: 1px;
                    height: px2rem(56px);
                    background-color: #fff;

                }
                &:last-child{
                    &:after{
                        display: none;
                    }
                }
            }
        }
    }
    .org-tabs{
        margin-bottom: px2rem(30px);
        background-color: #fff;
        .tab-btn{
            background-color: #fff;
            border-bottom: 1px solid $light-border-color;
            line-height:px2rem(90px);
            font-size: px2rem(28px);
            text-align: center;
            .tab-item{
                display: inline-block;
                padding: 0 px2rem(20px);
                margin: 0 px2rem(40px);
                &.cur{
                    border-bottom: 3px solid $blue;
                }
            }
        }
        .tab-content{
            padding: px2rem(30px);
            .line-container{
                width: 100%;
                height: px2rem(350px);
                margin: px2rem(30px) 0;
                color: $text-color-6;
                font-size: px2rem(20px);
                .no-data{
                    padding: .6rem 0;
                }
            }
        }
    }

    .org-pie{
        margin-bottom: px2rem(30px);
        padding-bottom: px2rem(30px);
        background-color: #fff;
        h5{
            border-bottom: 1px solid $light-border-color;
            font-size: px2rem(30px);
            line-height: px2rem(72px);
            padding: 0 px2rem(30px);
            img{
                width: px2rem(32px);
                margin: px2rem(20px) px2rem(10px);
            }
        }
        .pie-container{
            width: 100%;
            height: px2rem(700px);
            padding: px2rem(30px);
            .no-data{
                padding: 2rem 0;
            }
        }
        .btn-group{
            margin: 0 px2rem(30px);
        }
    }
    .btn-group{
        @extend .clearfix;
        border:1px solid #79abdc;
        border-radius: 4px;
        button{
            float: left;
            width: 33.3%;
            background: none;
            color: $text-color-9;
            line-height: px2rem(56px);
            border-right:1px solid #79abdc;
            &:last-child{
                border-right:none;
            }
            &.cur{
                background-color: #79abdc;
                color: #fff;
            }
        }

    }
}